package display.showcase {
	
	import flash.display.Bitmap;
	import flash.display.MovieClip;
	import flash.display.Sprite;
	import flash.events.Event;
	import flash.events.MouseEvent;
	import gs.TweenLite;
	
	/**
	 * ...
	 * @author Vjekoslav Ratkajec
	 */
	public class Showcase extends MovieClip {
		
		//{ region Stage elements
		
		//} endregion
		
		//{ region Variables
		
		private const SPACE_OFFSET:int = 6;
		private const BOUND_OFFSET:uint = 10;
		
		private var itemsList:Array = new Array();
		
		private var currentImage:MovieClip = null;
		
		private var duration:Number = 0.4;
		
		private var center:Boolean = false;
		
		//} endregion
		
		//{ region Contructor and initialization
		
		public function Showcase() {
			this.addEventListener(Event.ADDED_TO_STAGE, addedToStage);
		}
		
		private function addedToStage(event:Event):void {
			init();
		}
		
		private function init():void {
			initListeners();
		}
		
		private function initListeners():void {
			
		}
		
		//} endregion
		
		//{ region Handlers
		
		private function thumb_Click(event:MouseEvent):void {
			var name:String = String(event.currentTarget.name);
			switchItems(name.replace("_thumb", ""));
		}
		
		//} endregion
		
		//{ region Public 
		
		public function configUI(width:Number, height:Number, center:Boolean = false):void {
			this.center = center;
			
			//Draw opaque box to set height and width of container
			var boundingBox:Sprite = new Sprite();
			boundingBox.graphics.beginFill(0, 0);
			boundingBox.graphics.drawRect(0, 0, width, height);
			boundingBox.graphics.endFill();
			boundingBox.mouseEnabled = false;
			this.addChild(boundingBox);
		}
		
		public function addElementList(items:Array):void {
			for each (var item:ShowcaseItem in items) {
				itemsList.push(item);
			}
		}
		
		public function addElement(item:ShowcaseItem):void {
			itemsList.push(item);
		}
		
		public function build() {
			if (itemsList.length > 1) {
				var thumbStartX:Number = this.width;
				var thumbStartY:Number = this.height;
				var imageMC:MovieClip = null;
				for each (var item:ShowcaseItem in itemsList) {
					if (imageMC == null) {
						imageMC = item.image;
					} else {
						var thumbMC:MovieClip = item.thumb;
						thumbMC.x = this.width - thumbMC.width;
						thumbStartX = thumbMC.x - SPACE_OFFSET;
						thumbMC.y = thumbStartY - thumbMC.height;
						thumbStartY = thumbMC.y - SPACE_OFFSET;
						thumbMC.addEventListener(MouseEvent.CLICK, thumb_Click);
						this.addChild(thumbMC);
					}
				}
				
				doResize(imageMC);
				if (center) {
					imageMC.x = (thumbStartX - imageMC.width) / 2;
					imageMC.y = (this.height - imageMC.height) / 2;
				} else {
					imageMC.x = thumbStartX - imageMC.width;
					imageMC.y = this.height - imageMC.height;
				}
				
				this.addChild(imageMC);
				currentImage = imageMC;
				
			} else {
				throw new VerifyError("Must have at least 2 images.");
			}
		}
		
		//} endregion
		
		private function switchItems(name:String):void {
			//Switch thumbs
			var oldThumb:MovieClip = getThumbFromList(name);
			var newThumb:MovieClip = getThumbFromList(currentImage.name);
			newThumb.x = (newThumb.width == oldThumb.width) ? oldThumb.x : (this.width - newThumb.width);
			newThumb.y = (newThumb.height == oldThumb.height) ? oldThumb.y : (this.height - newThumb.height);
			
			newThumb.alpha = 0;
			newThumb.addEventListener(MouseEvent.CLICK, thumb_Click);
			this.addChild(newThumb);
			
			TweenLite.to(oldThumb, duration, { alpha:0, onComplete:removeImage, onCompleteParams:[oldThumb] } );
			TweenLite.to(newThumb, duration, { alpha:1 } );
			
			//Switch images
			var newImage:MovieClip = getImageFromList(name);
			doResize(newImage);
			
			//var startX:Number = currentImage.x + currentImage.width;
			if (center) {
				newImage.x = (newThumb.x - SPACE_OFFSET - newImage.width) / 2;
				newImage.y = (this.height - newImage.height) / 2;
			} else {
				newImage.x = newThumb.x - SPACE_OFFSET - newImage.width;
				newImage.y = this.height - newImage.height;
			}
			newImage.alpha = 0;
			this.addChild(newImage);
			
			TweenLite.to(currentImage, duration, { alpha:0, onComplete:removeImage, onCompleteParams:[currentImage] } );
			TweenLite.to(newImage, duration, { alpha:1 } );
			
			//Cleanup
			
			oldThumb.removeEventListener(MouseEvent.CLICK, thumb_Click);
			currentImage = newImage;
		}
		
		private function doResize(content:MovieClip):void {
			if (content.width > this.width || content.height > this.height) {
				var xratio:Number = this.width / content.width;
				var yratio:Number = this.height / content.height;
				var ratio:Number = (xratio < yratio) ? xratio : yratio;
				
				content.scaleX = ratio;
				content.scaleY = ratio;
			}
		}
		
		private function removeImage(imageMC:MovieClip):void {
			this.removeChild(imageMC);
		}
		
		//} endregion
		
		//{ region Helpers
		
		private function getImageFromList(name:String):MovieClip {
			for each (var item:ShowcaseItem in itemsList) {
				if (item.name == name) {
					return item.image;
				}
			}
			
			return null;
		}
		
		private function getThumbFromList(name:String):MovieClip {
			for each (var item:ShowcaseItem in itemsList) {
				if (item.name == name) {
					return item.thumb;
				}
			}
			
			return null;
		}
		
		//} endregion
		
	}
	
}